<template>
  <div>
    <ul class="icon_lists dib-box clearfix">
      <li class="dib">
        <span class="icon iconfont iconmima"></span>
        <div class="name">密码</div>
        <div class="code-name">.iconmima</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhanghao"></span>
        <div class="name">账号</div>
        <div class="code-name">.iconzhanghao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconfanhui"></span>
        <div class="name">返回</div>
        <div class="code-name">.iconfanhui</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconwancheng"></span>
        <div class="name">完成</div>
        <div class="code-name">.iconwancheng</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconjingshi"></span>
        <div class="name">警示</div>
        <div class="code-name">.iconjingshi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondengdaiyujingjieguo"></span>
        <div class="name">等待预警结果</div>
        <div class="code-name">.icondengdaiyujingjieguo</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icontianjiachulihuizhi"></span>
        <div class="name">添加处理回执</div>
        <div class="code-name">.icontianjiachulihuizhi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzaixianshengchenggongzibiao"></span>
        <div class="name">在线生成工资表</div>
        <div class="code-name">.iconzaixianshengchenggongzibiao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondaorugongzibiao"></span>
        <div class="name">导入工资表</div>
        <div class="code-name">.icondaorugongzibiao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconfafanggongzi"></span>
        <div class="name">发放工资</div>
        <div class="code-name">.iconfafanggongzi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconchuliyujing"></span>
        <div class="name">处理预警</div>
        <div class="code-name">.iconchuliyujing</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconbianjigongzibiao"></span>
        <div class="name">编辑工资表</div>
        <div class="code-name">.iconbianjigongzibiao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icontianjia"></span>
        <div class="name">添加</div>
        <div class="code-name">.icontianjia</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondaochu"></span>
        <div class="name">导出</div>
        <div class="code-name">.icondaochu</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconbianji"></span>
        <div class="name">编辑</div>
        <div class="code-name">.iconbianji</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshanchu"></span>
        <div class="name">删除</div>
        <div class="code-name">.iconshanchu</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconchulizhong"></span>
        <div class="name">处理中</div>
        <div class="code-name">.iconchulizhong</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconsuohui"></span>
        <div class="name">缩回</div>
        <div class="code-name">.iconsuohui</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icontiaozheng"></span>
        <div class="name">调整</div>
        <div class="code-name">.icontiaozheng</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconchazhao1"></span>
        <div class="name">查找</div>
        <div class="code-name">.iconchazhao1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconlizhi"></span>
        <div class="name">离职</div>
        <div class="code-name">.iconlizhi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconhuabanfuben"></span>
        <div class="name">提示</div>
        <div class="code-name">.iconhuabanfuben</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyiqueren"></span>
        <div class="name">已确认</div>
        <div class="code-name">.iconyiqueren</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondengdai"></span>
        <div class="name">等待</div>
        <div class="code-name">.icondengdai</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyuandian"></span>
        <div class="name">圆点</div>
        <div class="code-name">.iconyuandian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconjinbi"></span>
        <div class="name">支付总金额</div>
        <div class="code-name">.iconjinbi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconwenti"></span>
        <div class="name">常见问题</div>
        <div class="code-name">.iconwenti</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconfapiao"></span>
        <div class="name">交易凭证</div>
        <div class="code-name">.iconfapiao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshibai1"></span>
        <div class="name">失败</div>
        <div class="code-name">.iconshibai1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxuanzebumen"></span>
        <div class="name">选择部门</div>
        <div class="code-name">.iconxuanzebumen</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondingwei"></span>
        <div class="name">定位</div>
        <div class="code-name">.icondingwei</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconfanhui2"></span>
        <div class="name">返回</div>
        <div class="code-name">.iconfanhui2</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconcuowu"></span>
        <div class="name">错误</div>
        <div class="code-name">.iconcuowu</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyujingzhongxin"></span>
        <div class="name">预警中心</div>
        <div class="code-name">.iconyujingzhongxin</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconqiyeshezhi"></span>
        <div class="name">企业设置</div>
        <div class="code-name">.iconqiyeshezhi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconqiyekaoqin"></span>
        <div class="name">企业考勤</div>
        <div class="code-name">.iconqiyekaoqin</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icongongzidaifa"></span>
        <div class="name">工资代发</div>
        <div class="code-name">.icongongzidaifa</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconqiyeyuangong"></span>
        <div class="name">企业员工</div>
        <div class="code-name">.iconqiyeyuangong</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshouye"></span>
        <div class="name">首页</div>
        <div class="code-name">.iconshouye</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhanghaoguanli"></span>
        <div class="name">账号管理</div>
        <div class="code-name">.iconzhanghaoguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhengcetongbao"></span>
        <div class="name">政策通报</div>
        <div class="code-name">.iconzhengcetongbao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshujutongji"></span>
        <div class="name">数据统计</div>
        <div class="code-name">.iconshujutongji</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxitongyunwei"></span>
        <div class="name">系统运维</div>
        <div class="code-name">.iconxitongyunwei</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshenheguanli"></span>
        <div class="name">审核管理</div>
        <div class="code-name">.iconshenheguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconrenyuanguanli"></span>
        <div class="name">人员管理</div>
        <div class="code-name">.iconrenyuanguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconqiyeguanli"></span>
        <div class="name">企业管理</div>
        <div class="code-name">.iconqiyeguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondengdaijieguo"></span>
        <div class="name">等待结果</div>
        <div class="code-name">.icondengdaijieguo</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshangchuanfujian"></span>
        <div class="name">上传附件</div>
        <div class="code-name">.iconshangchuanfujian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconchuliyujing1"></span>
        <div class="name">处理预警</div>
        <div class="code-name">.iconchuliyujing1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhuanhuyujing1"></span>
        <div class="name">专户预警</div>
        <div class="code-name">.iconzhuanhuyujing1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshiyongtonggongyujing"></span>
        <div class="name">使用童工预警</div>
        <div class="code-name">.iconshiyongtonggongyujing</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icongongzituoqianyujing1"></span>
        <div class="name">工资拖欠预警</div>
        <div class="code-name">.icongongzituoqianyujing1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhizuogongzibiao"></span>
        <div class="name">制作工资表</div>
        <div class="code-name">.iconzhizuogongzibiao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyincang"></span>
        <div class="name">yincang</div>
        <div class="code-name">.iconyincang</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxianshi"></span>
        <div class="name">xianshi</div>
        <div class="code-name">.iconxianshi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshangchuan"></span>
        <div class="name">上传</div>
        <div class="code-name">.iconshangchuan</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconfujian"></span>
        <div class="name">附件</div>
        <div class="code-name">.iconfujian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxiala"></span>
        <div class="name">下拉</div>
        <div class="code-name">.iconxiala</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icontianjia1"></span>
        <div class="name">添加</div>
        <div class="code-name">.icontianjia1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshezhi"></span>
        <div class="name">设置</div>
        <div class="code-name">.iconshezhi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconjian"></span>
        <div class="name">减</div>
        <div class="code-name">.iconjian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyou"></span>
        <div class="name">右</div>
        <div class="code-name">.iconyou</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzuo"></span>
        <div class="name">左</div>
        <div class="code-name">.iconzuo</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconfanhui1"></span>
        <div class="name">返回</div>
        <div class="code-name">.iconfanhui1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshengming"></span>
        <div class="name">声明</div>
        <div class="code-name">.iconshengming</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icongongnengjieshao"></span>
        <div class="name">功能介绍</div>
        <div class="code-name">.icongongnengjieshao</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshenqingtiaojian"></span>
        <div class="name">申请条件</div>
        <div class="code-name">.iconshenqingtiaojian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhankai"></span>
        <div class="name">展开</div>
        <div class="code-name">.iconzhankai</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshouqi"></span>
        <div class="name">收起</div>
        <div class="code-name">.iconshouqi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyou1"></span>
        <div class="name">右</div>
        <div class="code-name">.iconyou1</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxiangmupingjia"></span>
        <div class="name">项目评价</div>
        <div class="code-name">.iconxiangmupingjia</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxitongshezhi"></span>
        <div class="name">系统设置</div>
        <div class="code-name">.iconxitongshezhi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxinyongjianguan"></span>
        <div class="name">信用监管</div>
        <div class="code-name">.iconxinyongjianguan</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icongongchengxiangmu"></span>
        <div class="name">工程项目</div>
        <div class="code-name">.icongongchengxiangmu</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icongengduo"></span>
        <div class="name">更多</div>
        <div class="code-name">.icongengduo</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icondongtaijianguan"></span>
        <div class="name">动态监管</div>
        <div class="code-name">.icondongtaijianguan</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconbianzu"></span>
        <div class="name">通知</div>
        <div class="code-name">.iconbianzu</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshuoming"></span>
        <div class="name">说明</div>
        <div class="code-name">.iconshuoming</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconyingyongshichang"></span>
        <div class="name">应用市场</div>
        <div class="code-name">.iconyingyongshichang</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icontongzhizhongxin"></span>
        <div class="name">通知中心</div>
        <div class="code-name">.icontongzhizhongxin</div>
      </li>

      <li class="dib">
        <span class="icon iconfont icongongshangbaoxian"></span>
        <div class="name">工伤保险</div>
        <div class="code-name">.icongongshangbaoxian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconkaoqinguanli"></span>
        <div class="name">考勤管理</div>
        <div class="code-name">.iconkaoqinguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconbaozhengjinguanli"></span>
        <div class="name">保证金管理</div>
        <div class="code-name">.iconbaozhengjinguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconxiangmuguanli"></span>
        <div class="name">项目管理</div>
        <div class="code-name">.iconxiangmuguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhongdaweifashijian"></span>
        <div class="name">重大违法事件</div>
        <div class="code-name">.iconzhongdaweifashijian</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconzhuanhuguanli"></span>
        <div class="name">专户管理</div>
        <div class="code-name">.iconzhuanhuguanli</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconshimingzhi"></span>
        <div class="name">实名制</div>
        <div class="code-name">.iconshimingzhi</div>
      </li>

      <li class="dib">
        <span class="icon iconfont iconweiquanjiufen"></span>
        <div class="name">维权纠纷</div>
        <div class="code-name">.iconweiquanjiufen</div>
      </li>
    </ul>
  </div>
</template>
<script>
//在字体图标文件中全局搜索  第二步：定义使用 iconfont 的样式
//将其中的ul全部复制到这个页面即可
export default {
  data() {
    return {}
  },
  created() {},
  mounted() {
    var that = this
    $('.icon_lists .icon').click(function () {
      that.$emit('getData', $(this).attr('class'))
    })
  },

  methods: {},
}
</script>
<style scoped lang="less">
.dib {
  float: left;
  margin: 8px;
  cursor: pointer;
  span {
    font-size: 25px;
  }
  .name {
    display: none;
  }
  .code-name {
    display: none;
  }
}
</style>
